Tec{h}tonic | Avatar

Avatar

Tec{h}tonic gives you some types of avatar for user profiles etc. in your website.

Simple Round Avatars

You can add a round avatar with class "round-av" with your image source.


                        
    
      
        
  
    
    

        


  


  
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="round-av">
        
  



    

  


      
      
        view raw
        
          gistfile1.txt
        
        hosted with ❤ by GitHub

Round Avatar with different sizes

You can add round avatar with different size as "small", "normal", "large" if you'd just add respective size with "round-av" class with your image source.


                        
    
      
        
  
    
    

        


  


  
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="round-av small">
        
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="round-av normal">
        
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="round-av large">
        
  



    

  


      
      
        view raw
        
          gistfile1.txt
        
        hosted with ❤ by GitHub

Simple Square Avatar

You can add a round avatar with class "squared-av" with your image source.


                        
    
      
        
  
    
    

        


  


  
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="squared-av">
        
  



    

  


      
      
        view raw
        
          gistfile1.txt
        
        hosted with ❤ by GitHub

Square Avatar with different sizes

You can add round avatar with different size as "small", "normal", "large" if you'd just add respective size with "squared-av" class with your image source.


                        
    
      
        
  
    
    

        


  


  
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="squared-av small">
        
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="squared-av normal">
        
        
          
          <img src="../../assets/avatar-image.jpg" alt="" class="squared-av large">
        
  



    

  


      
      
        view raw
        
          gistfile1.txt
        
        hosted with ❤ by GitHub

	<img src="../../assets/avatar-image.jpg" alt="" class="round-av small">
	<img src="../../assets/avatar-image.jpg" alt="" class="round-av normal">
	<img src="../../assets/avatar-image.jpg" alt="" class="round-av large">